<template>
  <div>
    <div class="all">
      <img src="https://shop.io.mi-img.com/app/shop/img?w=1080&h=468&id=shop_fec440b72955b6d54fe7ddfc8b83a2b2.jpeg" alt="">
      <div class="ico">
        <img src="" alt="" @click="fun()">
        <img src="https://img.youpin.mi-img.com/static/weex_images/v1/icon_info_white.png" alt="" style="margin-right:0">
      </div>
      <div class="characters">
        <h3 style="color:white;margin-top:30px">往期众筹</h3>
        <p style="color:white;opacity:0.4;font-size:13.5px">小米众筹成功项目回顾</p>
      </div>
    </div>
      <Form
      v-for="(v,i) in this.$store.state.formstore.arr" 
         :key="i"
         :img="v.img"
         :name="v.name"
         :title="v.title"
         :price="v.price"/>
      
  </div>
</template>

<script>
import Form from "@/components/crow/form"
export default {
   created () {
        //在页面加载时读取localStorage里的状态信息
        if (localStorage.getItem("data") ) {
            //replaceState替换数据 Object.assign合并对象
            this.$store.replaceState(Object.assign({}, this.$store.state,JSON.parse(localStorage.getItem("data"))))
        } 
        //在页面刷新时将vuex里的信息保存到localStorage里
        window.addEventListener("beforeunload",()=>{
            localStorage.setItem("data",JSON.stringify(this.$store.state))
        })
      },
  methods:{
    fun(){
      this.$router.go(-1);
    }
  },
  components:{
    Form
  }
}
</script>

<style scoped>
.all{
  text-align: center;
}
  .all img{
    width:375px;
    height: 162.5px;
  }
  .ico{
    display: flex;
    justify-content: space-between;
    background-color: black;
    margin-top: -150px;
  }
  .ico img{
    width: 18px;
    height: 18px;
  }
</style>